import React from 'react';
import { GridContent } from '@ant-design/pro-layout';
import { Card, Space, Row, Col, Statistic } from 'antd';

export default (): React.ReactNode => {
  return (
    <GridContent style={{ margin: 0, width: '100%' }}>
      <Card bodyStyle={{ padding: '32px 24px' }}>
        <Space direction="vertical" size={32} style={{ width: '100%' }}>
          <Row
            gutter={16}
            align="middle"
            style={{ maxWidth: '1200px', justifyContent: 'space-between', margin: '0 auto' }}
          >
            <Col flex={1} style={{ paddingLeft: '0px' }}>
              <Card
                style={{ borderLeft: '3px solid #1890FF' }}
                bodyStyle={{ paddingLeft: 40, paddingBottom: 10, height: '125px' }}
              >
                <Statistic title="总商品数" value={2} />
              </Card>
            </Col>
            <Col flex={1}>
              <Card
                style={{ borderLeft: '3px solid #1890FF' }}
                bodyStyle={{ paddingLeft: 40, paddingBottom: 10, height: '125px' }}
              >
                <Statistic title="总订单数" value={3} />
              </Card>
            </Col>
            <Col flex={1}>
              <Card
                style={{ borderLeft: '2px solid #1890FF' }}
                bodyStyle={{ paddingLeft: 40, paddingBottom: 10, height: '125px' }}
              >
                <Statistic title="总用户数" value={4} />
              </Card>
            </Col>
            <Col flex={1}>
              <Card
                style={{ borderLeft: '3px solid #1890FF' }}
                bodyStyle={{ paddingLeft: 40, paddingBottom: 10, height: '125px' }}
              >
                <Statistic title="总分类数" value={5} />
              </Card>
            </Col>
            <Col flex={1} style={{ paddingRight: '0px' }}>
              <Card
                style={{ borderLeft: '3px solid #1890FF' }}
                bodyStyle={{ paddingLeft: 40, paddingBottom: 10, height: '125px' }}
              >
                <Statistic title="已退出基金数" value={6} />
              </Card>
            </Col>
          </Row>
        </Space>
      </Card>
    </GridContent>
  );
};
